<template name="classTable">
    <el-table
        :data="classList"
        style="width: 100%"
        :row-style="{cursor:'pointer'}"
        row-key="id"
        border
        highlight-current-row
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
        <el-table-column
            prop="id"
            align="center"
            label="分类ID">
        </el-table-column>
        <el-table-column
            label="分类图片"
            align="center">
            <template scope="scope">
                <img :src="scope.row.head_img" width="40" height="40"/>
            </template>
        </el-table-column>
        <el-table-column
            prop="class_name"
            label="分类名称"
            align="center">
        </el-table-column>
        <el-table-column
            label="操作"
            align="center">
            <template slot-scope="scope">
                <el-button
                    size="mini"
                    @click="handleSee(scope.$index, scope.row)">查看</el-button>
                <el-button
                    size="mini"
                    @click="handleEdit(scope.$index, scope.row)">修改</el-button>
                <el-button
                    size="mini"
                    @click="handleDelete(scope.$index, scope.row)">删除</el-button>
            </template>
        </el-table-column>
    </el-table>
</template>

<script>
export default {
    name: "classTable",
    props: ['classList'],
    data(){
        return{
        }
    },
    methods: {
        handleSee(index,row){
            console.log(index, row);
            this.$router.push({
                path: '/newClass',
                query: {
                    type: 4,
                    list: row
                }
            })
        },
        handleEdit(index, row) {
            console.log(index, row);
            this.$router.push({
                path: '/newClass',
                query: {
                    type: 2,
                    list: row
                }
            })
        },
        handleDelete(index, row) {
            console.log(index, row);
            this.$confirm('此操作将永久删除该分类, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.operationClass(row)
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
        },
        async operationClass(list){
            let number = (list.fid == 1)?1:2;
            let res = await this.$Http.operationClass({
                type: 3,
                id: list.id,
                number:number
            })
            console.log(res)
            if(res.code == 1){
                this.$message({
                    type: 'success',
                    message: '此分类删除成功!'
                });
            }
            this.$emit('refreshTableFun')
        }
    }
}
</script>
